<template>
    <el-dialog :model-value="dialogFormVisible" :destroy-on-close="true" :title="dialogTitle" width="600px"
        @close="emits('closeDialog')">
        <el-timeline style="padding-left:50px;">
            <el-timeline-item v-for="(item, index) in auditHistory"
              :timestamp="item.audit_level + '审：' + item.level_name" :type="item.type" :hollow="!item.his_order_id" placement="top">
              <el-card shadow="never" v-if="item.his_order_id">
                <p>审核组：{{ item.his_group_name }}</p>
                <p>审核人：{{ item.his_audit_user }}</p>
                <p>审核时间：{{ formatDates(item.his_createtime) }}</p>
                <p>审核结果：<el-tag :type="item.his_audit_result == 'pass' ? 'success' : 'danger'">{{ item.his_audit_result == 'pass' ? '通过' : '拒绝' }}</el-tag></p>
                <p v-if="item.his_remark">备注：{{ item.his_remark }}</p>
              </el-card>
              <el-card shadow="never" v-else>
                <p>审核组：{{ item.group_name }}</p>
                <!--<p>审核人：{{ item.audit_user }}</p>-->
                <p>审核状态：<el-tag type="warning">等待审核</el-tag></p>
              </el-card>
            </el-timeline-item>
        </el-timeline>
        <el-form ref="dialogFormRef" :model="dialogForm" prop="country_code" :rules="rules" v-if="btnType == 'audit'">
            <!--<el-form-item label="订单流水号" :label-width="formLabelWidth" prop="bill_no">-->
            <!--    <el-input v-model="dialogForm.bill_no" readonly />-->
            <!--</el-form-item>-->
            <el-form-item label="审核结果" :label-width="formLabelWidth" prop="review_status">
                <el-radio-group v-model="dialogForm.review_status">
                    <el-radio key="1" label="1">通过</el-radio>
                    <el-radio key="2" label="2">拒绝</el-radio>
                </el-radio-group>
            </el-form-item>
            <el-form-item label="审核意见" :label-width="formLabelWidth" prop="review_reason">
                <el-input v-model="dialogForm.review_reason" type="textarea" rows="3" />
            </el-form-item>
            <el-form-item label="链上转账Hash" :label-width="formLabelWidth">
                <el-input v-model="dialogForm.txid" ref="txidValue" />
                <el-tag v-if="dialogForm.review_status == '1'" class="el-tag--danger">请输入链上转账的交易Hash!</el-tag>
            </el-form-item>
        </el-form>
        <template #footer>
            <span class="dialog-footer" v-if="btnType == 'audit'">
                <el-button @click="emits('cancel')">取消</el-button>
                <el-button type="primary" @click="submit(dialogForm)" :loading="btnLoading">提交</el-button>
            </span>
        </template>
    </el-dialog>
</template>
  
<script setup>
import { ref } from "vue";
import { formatDates } from "@/utils/utils";
const dialogFormRef = ref(null);

defineProps({
    dialogFormVisible: {
        type: Boolean,
        default: false,
    },
    dialogForm: {
        type: Object,
        default: {
            audit_order_id: "",
            bill_no: "",
            review_status: "",
            review_reason: "",
            txid: "",
        },
    },
    btnLoading: {
        type: Boolean,
        default: false,
    },
    dialogTitle: {
        type: String,
        default: "",
    },
    btnType: {type: String, default: ""},
    auditHistory: {type: Array, default: []}
});

const emits = defineEmits(["closeDialog", "cancel", "submitForm"]);

const formLabelWidth = "140";
const txidValue = ref(null);
const rules = {
//    bill_no: [{ required: true, message: "订单流水号不能为空", trigger: "blur" }],
    review_status: [{ required: true, message: "请选择审核结果", trigger: "blur" }],
};

const submit = (dialogForm) => {
    dialogFormRef.value
        .validate()
        .then(async () => {
            try {
                const param = Object.assign(
                    {},
                    {
                        audit_order_id: dialogForm.audit_order_id,
                        bill_no: dialogForm.bill_no,
                        review_status: dialogForm.review_status,
                        review_reason: dialogForm.review_reason,
                        txid: dialogForm.txid,
                    }
                );
                if (dialogForm.review_status == '1' && !dialogForm.txid) {
                    txidValue.value.focus();
                    return false;
                } else {
                    emits("submitForm", param);
                }
            } catch (error) {
                return false;
//                console.log(error);
            }
        })
        .catch((error) => {
            return false;
//            console.log(error);
        });
};
</script>
  